<template>
  <div class="app">
    <div class="contener boderSet">
      <div class="crumbs">
        <el-breadcrumb separator-class="el-icon-arrow-right">
          <el-breadcrumb-item :to="{ path: '/' }">基础设置</el-breadcrumb-item>
          <el-breadcrumb-item>审批流程设置</el-breadcrumb-item>
        </el-breadcrumb>
      </div>
      <template>
        <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
          <el-tab-pane label="教学设备审批管理" name="first">
            <br />
            <el-tabs v-model="activeNames" @tab-click="handleClicks">
              <el-tab-pane label="借出" name="first">
                <!--引用页面-->
                <lend state="1"></lend>
              </el-tab-pane>
              <el-tab-pane label="挂失" name="second"
                ><lend state="2"></lend
              ></el-tab-pane>
              <el-tab-pane label="报修" name="third"><lend state="3"></lend></el-tab-pane>
              <el-tab-pane label="报废" name="fourth"
                ><lend state="4"></lend
              ></el-tab-pane>
            </el-tabs>
          </el-tab-pane>
          <el-tab-pane label="易耗品审批管理" name="second">
            <br />
            <el-tabs v-model="activeNames" @tab-click="handleClicks">
              <el-tab-pane label="分发" name="first"><lend lend state="5"></lend></el-tab-pane>
              <el-tab-pane label="核销" name="second"
                ><lend lend state="5"></lend
              ></el-tab-pane>
            </el-tabs>
          </el-tab-pane>
        </el-tabs>
      </template>
    </div>
  </div>
</template>

<script>
import lend from "@/components/Pevin_Infrastructure/lend.vue";
export default {
  components: {
    lend,
  },
  data() {
    return {
      activeName: "first",
      activeNames: "second",
      state:2
    };
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab, event);
    },
    handleClicks(tab, event) {
      console.log(tab, event);
      console.log("借出");
      this.$router.push({ path: this.lend });
    },
  },
};
</script>

<style>
.contener {
  margin: 20px 30px;
  padding: 30px;
}
.boderSet {
  border-radius: 10px !important;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}

.crumbs {
  margin-bottom: 20px;
}
</style>